import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from "path"
import { VitePWA } from 'vite-plugin-pwa'
import WindiCSS from 'vite-plugin-windicss'
import Pages from "vite-plugin-pages";
import vueI18n from '@intlify/vite-plugin-vue-i18n'
import { viteVConsole } from 'vite-plugin-vconsole'
import viteCompression from 'vite-plugin-compression'

// https://vitejs.dev/config/
export default defineConfig({
  base:'/vite-vue3-shop',
  resolve:{
    alias:{
      '@':path.resolve(__dirname, "src")
    }
  },
  server:{
    host:'0.0.0.0',
    //https:true
  },
  plugins: [
    vue(),
    WindiCSS(),
    Pages({
      dirs:'src/views',
      nuxtStyle:true,
      exclude:["**/components/*.vue"],
      extendRoute(route, parent){
        if(!route?.meta) route.meta={}
        if(!route.meta.roles) route.meta.roles=[]
        return {
          ...route
        }
      },
      onClientGenerated(code){
        const newCode=code.replaceAll(/"name":"(.*?)".*?import\((.*?)\)/g,(match,p1,p2) =>{
          return `${match}.then(module => {module.default.name='${p1}';return module})`
        })
        return newCode
      }
    }),
    vueI18n({
      defaultSFCLang:'json5',
      include:path.resolve(__dirname, './src/locales/**')
    }),
    viteVConsole({
      entry: path.resolve('src/main.ts'),
      localEnabled: true,
      enabled: false,
      config: {
        maxLogNumber: 1000,
        theme: 'light'
      }
    }),
    viteCompression({
      threshold:1025,
      algorithm:'gzip',
      ext:'.gz'
    }),
    VitePWA({
      //registerType: 'autoUpdate',
      strategies: 'generateSW',
      includeAssets: ['favicon.svg', 'favicon.ico', 'robots.txt', 'apple-touch-icon.png'],  
      manifest: {
        name: 'App Name',
        short_name: 'Short App Name',
        description: 'Description of your app',
        theme_color: '#ffffff',
        icons: [
          {
            src: 'pwa-192x192.png',
            sizes: '192x192',
            type: 'image/png',
          },
          {
            src: 'pwa-512x512.png',
            sizes: '512x512',
            type: 'image/png',
          },
          {
            src: 'pwa-512x512.png',
            sizes: '512x512',
            type: 'image/png',
            purpose: 'any maskable',
          }
        ]
      }
    })
  ]
})
